<template>
    <div>
    <!-- 导航部分开始 -->
    <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/' }">首页 </el-breadcrumb-item>>
        <el-breadcrumb-item>质量管理</el-breadcrumb-item>
        <el-breadcrumb-item>过程检验</el-breadcrumb-item>
    </el-breadcrumb>
    <!-- 导航部分结束 -->
    <!--  搜索栏开始 -->
    <el-form style="margin-top: 15px;" :inline="true" :model="queryIpqc" class="demo-form-inline">
        <el-form-item label="检验单编号">
            <el-input v-model="queryIpqc.ipqcCode" placeholder="请输入来料检验单编号" clearable />
        </el-form-item>

        <el-form-item label="检验类型">
            <el-select v-model="queryIpqc.ipqcType" placeholder="请选择检测类型">
                <el-option label="首检" value="首检" />
                <el-option label="未检" value="未检" />
                <el-option label="自检" value="自检" />
                <el-option label="巡检" value="巡检" />
                <el-option label="点检" value="点检" />
                <el-option label="终检" value="终检" />
            </el-select>
        </el-form-item>

        <el-form-item label="工单编号">
            <el-input v-model="queryIpqc.workorderCode" placeholder="请输入工单编号" clearable />
        </el-form-item>

        <el-form-item label="产品物料编码">
            <el-input v-model="queryIpqc.itemCode" placeholder="请输入产品物料编码" clearable />
        </el-form-item>

        <el-form-item label="产品物料名称">
            <el-input v-model="queryIpqc.itemName" placeholder="请输入产品物料名称" clearable />
        </el-form-item>

        <el-form-item label="检测结果">
            <el-select v-model="queryIpqc.checkResult" placeholder="请选择检测结果">
                <el-option label="检验通过" value="检验通过" />
                <el-option label="检验不通过" value="检验不通过" />
            </el-select>
        </el-form-item>


        <el-form-item>
            <el-button type="primary" @click="loadipqc">搜索</el-button>
            <el-button @click="resettingipqc">重置</el-button>

        </el-form-item>
    </el-form>
    <!--  搜索栏结束 -->
    <!-- 工具栏开始 -->
    <div class="flex">
        <el-button title="新增" @click="this.addIpqcDialogVisible = true" type="primary"><el-icon>
                <Plus />
            </el-icon>新增</el-button>
        <el-button color="#b3e19d" @click="handlerEditIqc" title="修改" type="primary"><el-icon>
                <EditPen />
            </el-icon>修改</el-button>

        <el-button color="#f89898" @click="handlerDeleteIqc" title="删除" type="primary"><el-icon>
                <Delete />
            </el-icon>删除</el-button>

    </div>
    <!-- 表格 开始 -->
    <el-table ref="ipqcTable" :data="ipqc" max-height="800px" :stripe="true" :border="true"
        style="width: 200%;margin-top: 10px;">
        <el-table-column type="selection" />

        <el-table-column width="150" align="center" label="检验单编号" property="ipqcCode">
            <template #default="scope">
                <el-link type="success" @click="showIpqcData(scope.row.ipqcId)">
                    {{ scope.row.ipqcCode }}
                </el-link>
            </template>
        </el-table-column>
        <el-table-column width="150" align="center" label="检验单类型" property="ipqcType" />
        <el-table-column width="150" align="center" label="工单编号" property="workorderCode" />
        <el-table-column width="150" align="center" label="产品物料编码" property="itemCode" />
        <el-table-column width="150" align="center" label="产品物料名称" property="itemName" />
        <el-table-column width="150" align="center" label="规格型号" property="specification" />
        <el-table-column width="150" align="center" label="单位" property="unitOfMeasure" />
        <el-table-column width="150" align="center" label="检测数量" property="quantityCheck" />
        <el-table-column width="150" align="center" label="检测结果" property="checkResult" />
        <el-table-column width="150" align="center" label="检测日期" property="inspectDate" />
        <el-table-column width="150" align="center" label="检测人员" property="inspecor" />
        <el-table-column width="150" align="center" label="单据状态" property="status" />
        <el-table-column width="200" align="center" label="操作">
            <template #default="scope">
                <div v-if="scope.row.status == '草稿' || scope.row.status != '已完成'">
                    <el-button size="small" type="primary" @click="handleEdit(scope.row)">修改</el-button>
                    <el-popconfirm confirm-button-text="是" cancel-button-text="点错了" @confirm="handleDelete(scope.row)"
                        title="您是否要删除这行数据">
                        <template #reference>
                            <el-button size="small" type="danger">删除</el-button>
                        </template>
                    </el-popconfirm>
                </div>
                <div v-if="scope.row.status == '已确认'">
                    <el-button size="small" type="info" @click="handleAddSon(scope.row)">新增</el-button>
                    <el-button size="small" type="success" @click="handleFinish(scope.row)">完成</el-button>
                </div>
            </template>
        </el-table-column>
    </el-table>
    <!-- 表格 结束 -->
    <!-- 分页栏开始 -->
    <el-pagination style="margin-top: 15px;" :page-size="ipqcLimit" :pager-count="ipqcMaxPage"
        @current-change="changePageIpqc" background layout="prev, pager, next" :total="ipqcTotal" />
    <!-- 分页栏结束 -->


    <!-- 查看来料信息弹窗窗体开始-->
    <el-dialog v-model="DialogVisibles" title="查看来料信息" width="65%" align-center>
        <!-- 表单 -->
        <el-form label-width="100px" :model="lookIpqc" style="max-width: 900px">

            <el-row>
                <el-col :span="12">
                    <el-form-item label="检验单编号">
                        <el-input v-model="lookIpqc.ipqcCode" placeholder="请输入检验单编号" />
                    </el-form-item>

                </el-col>
                <el-col :span="12">
                    <el-form-item label="检验单名称">
                        <el-input v-model="lookIpqc.ipqcName" placeholder="请输入检验单名称" />
                    </el-form-item>

                </el-col>
            </el-row> <el-row>
                <el-col :span="8">
                    <el-form-item label="检验类型">
                        <el-select v-model="lookIpqc.ipqcType" placeholder="请选择检测类型">
                            <el-option label="首检" value="首检" />
                            <el-option label="未检" value="未检" />
                            <el-option label="自检" value="自检" />
                            <el-option label="巡检" value="巡检" />
                            <el-option label="点检" value="点检" />
                            <el-option label="终检" value="终检" />
                        </el-select>
                    </el-form-item>

                </el-col>
                <el-col :span="8">
                    <el-form-item label="工单编码">
                        <el-input v-model="lookIpqc.workorderCode" disabled placeholder="请搜索工序编码">
                            <template #append>
                                <el-button @click="this.searchWork = true" type="primary"><el-icon>
                                        <Search />
                                    </el-icon></el-button>
                            </template>
                        </el-input>
                    </el-form-item>

                </el-col>
                <el-col :span="8">
                    <el-form-item label="工单名称">
                        <el-input v-model="lookIpqc.workorderName" disabled />
                    </el-form-item>

                </el-col>
            </el-row>

            <el-row>
                <el-col :span="8">
                    <el-form-item label="工作站编号">
                        <el-input v-model="lookIpqc.workstationCode" disabled placeholder="请搜索工序编码">
                            <template #append>
                                <el-button @click="this.searchStation = true" type="primary"><el-icon>
                                        <Search />
                                    </el-icon></el-button>
                            </template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="工作站名称">
                        <el-input v-model="lookIpqc.workstationName" disabled clearable />
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="检测数量">
                        <el-input v-model="lookIpqc.quantityCheck" />
                    </el-form-item>
                </el-col>
            </el-row>
            <!--  -->
            <div class="demo-collapse">
                <el-collapse accordion>
                    <el-collapse-item name="1">
                        <template #title>
                            更多信息<el-icon class="header-icon">
                                <info-filled />
                            </el-icon>
                        </template>
                        <div>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="产品编码">
                                        <el-input v-model="lookIpqc.itemCode" disabled>
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="产品名称">
                                        <el-input v-model="lookIpqc.itemName" disabled clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="单位">
                                        <el-input v-model="lookIpqc.unitOfMeasure" disabled />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="规格型号">
                                        <el-input v-model="lookIpqc.specification" :rows="2" type="textarea" />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="工序编码">
                                        <el-input v-model="lookIpqc.processCode" placeholder="请输入工序编码" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="工序名称">
                                        <el-input v-model="lookIpqc.processName" placeholder="请输入工序名称" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="任务编号">
                                        <el-input v-model="lookIpqc.taskCode" placeholder="请输入任务编号" clearable />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="8">

                                    <el-form-item label="任务名称">
                                        <el-input v-model="lookIpqc.taskName" placeholder="请输入任务名称" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="不合格数">
                                        <el-input v-model="lookIpqc.quantityUnqualified" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="合格数量">
                                        <el-input v-model="lookIpqc.quantityQuanlified" placeholder="请输入合格数量" clearable />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="致命缺陷数量">
                                        <el-input v-model="lookIpqc.crQuantity" placeholder="请输入致命缺陷数量" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="严重缺陷数量">
                                        <el-input v-model="lookIpqc.majQuantity" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="轻微缺陷数量">
                                        <el-input v-model="lookIpqc.minQuantity" placeholder="请输入轻微缺陷数量" clearable />
                                    </el-form-item>
                                </el-col>
                            </el-row>

                        </div>
                    </el-collapse-item>
                </el-collapse>
            </div>

            <el-row>
                <el-col :span="8">
                    <el-form-item label="检测日期">
                        <el-date-picker v-model="lookIpqc.inspectDate" value-format="YYYY/MM/DD" type="date"
                            placeholder="请选择检测日期" />
                    </el-form-item>

                </el-col>
                <el-col :span="8">
                    <el-form-item label="检测结果">
                        <el-select v-model="lookIpqc.checkResult" placeholder="请选择检测结果">
                            <el-option label="检验通过" value="检验通过" />
                            <el-option label="检验不通过" value="检验不通过" />
                        </el-select>
                    </el-form-item>

                </el-col>
                <el-col :span="8">

                    <el-form-item label="检测人员">
                        <el-input v-model="lookIpqc.inspecor" placeholder="请填写检测人员" clearable />
                    </el-form-item>

                </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                    <el-form-item label="备注">
                        <el-input v-model="lookIpqc.indexRemark" :rows="2" type="textarea" />
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <template #footer>
            <div sty le="flex: auto">
                <el-button @click="cancelLookIpqcEdit">取消</el-button>
                <el-button type="primary" @click="doLookIpqcReturn">返回</el-button>
            </div>
        </template>
    </el-dialog>
    <!-- 查看信息弹窗窗体结束-->

    <!--新增事件弹窗开始 -->
    <el-dialog v-model="addIpqcDialogVisible" title="添加检验名单" width="65%" align-center>
        <!-- 添加检测的表单 -->
        <el-form label-width="100px" :model="newIpqc" style="max-width: 900px">

            <el-row>
                <el-col :span="12">
                    <el-form-item label="检验单编号">
                        <el-input v-model="newIpqc.ipqcCode" placeholder="请输入检验单编号" />
                    </el-form-item>

                </el-col>
                <el-col :span="12">
                    <el-form-item label="检验单名称">
                        <el-input v-model="newIpqc.ipqcName" placeholder="请输入检验单名称" />
                    </el-form-item>

                </el-col>
            </el-row> <el-row>
                <el-col :span="8">
                    <el-form-item label="检验类型">
                        <el-select v-model="newIpqc.ipqcType" placeholder="请选择检测类型">
                            <el-option label="首检" value="首检" />
                            <el-option label="未检" value="未检" />
                            <el-option label="自检" value="自检" />
                            <el-option label="巡检" value="巡检" />
                            <el-option label="点检" value="点检" />
                            <el-option label="终检" value="终检" />
                        </el-select>
                    </el-form-item>

                </el-col>
                <el-col :span="8">
                    <el-form-item label="工单编码">
                        <el-input v-model="newIpqc.workorderCode" disabled placeholder="请搜索工序编码">
                            <template #append>
                                <el-button @click="this.searchWork = true" type="primary"><el-icon>
                                        <Search />
                                    </el-icon></el-button>
                            </template>
                        </el-input>
                    </el-form-item>

                </el-col>
                <el-col :span="8">
                    <el-form-item label="工单名称">
                        <el-input v-model="newIpqc.workorderName" disabled />
                    </el-form-item>

                </el-col>
            </el-row>

            <el-row>
                <el-col :span="8">
                    <el-form-item label="工作站编号">
                        <el-input v-model="newIpqc.workstationCode" disabled placeholder="请搜索工序编码">
                            <template #append>
                                <el-button @click="this.searchStation = true" type="primary"><el-icon>
                                        <Search />
                                    </el-icon></el-button>
                            </template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="工作站名称">
                        <el-input v-model="newIpqc.workstationName" disabled clearable />
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="检测数量">
                        <el-input v-model="newIpqc.quantityCheck" />
                    </el-form-item>
                </el-col>
            </el-row>
            <!--  -->
            <div class="demo-collapse">
                <el-collapse accordion>
                    <el-collapse-item name="1">
                        <template #title>
                            更多信息<el-icon class="header-icon">
                                <info-filled />
                            </el-icon>
                        </template>
                        <div>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="产品编码">
                                        <el-input v-model="newIpqc.itemCode" disabled>
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="产品名称">
                                        <el-input v-model="newIpqc.itemName" disabled clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="单位">
                                        <el-input v-model="newIpqc.unitOfMeasure" disabled />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="规格型号">
                                        <el-input v-model="newIpqc.specification" :rows="2" type="textarea" />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="工序编码">
                                        <el-input v-model="newIpqc.processCode" placeholder="请输入工序编码" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="工序名称">
                                        <el-input v-model="newIpqc.processName" placeholder="请输入工序名称" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="任务编号">
                                        <el-input v-model="newIpqc.taskCode" placeholder="请输入任务编号" clearable />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="8">

                                    <el-form-item label="任务名称">
                                        <el-input v-model="newIpqc.taskName" placeholder="请输入任务名称" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="不合格数">
                                        <el-input v-model="newIpqc.quantityUnqualified" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="合格数量">
                                        <el-input v-model="newIpqc.quantityQuanlified" placeholder="请输入合格数量" clearable />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="致命缺陷数量">
                                        <el-input v-model="newIpqc.crQuantity" placeholder="请输入致命缺陷数量" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="严重缺陷数量">
                                        <el-input v-model="newIpqc.majQuantity" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="轻微缺陷数量">
                                        <el-input v-model="newIpqc.minQuantity" placeholder="请输入轻微缺陷数量" clearable />
                                    </el-form-item>
                                </el-col>
                            </el-row>

                        </div>
                    </el-collapse-item>
                </el-collapse>
            </div>

            <el-row>
                <el-col :span="8">
                    <el-form-item label="检测日期">
                        <el-date-picker v-model="newIpqc.inspectDate" value-format="YYYY/MM/DD" type="date"
                            placeholder="请选择检测日期" />
                    </el-form-item>

                </el-col>
                <el-col :span="8">
                    <el-form-item label="检测结果">
                        <el-select v-model="newIpqc.checkResult" placeholder="请选择检测结果">
                            <el-option label="检验通过" value="检验通过" />
                            <el-option label="检验不通过" value="检验不通过" />
                        </el-select>
                    </el-form-item>

                </el-col>
                <el-col :span="8">

                    <el-form-item label="检测人员">
                        <el-input v-model="newIpqc.inspecor" placeholder="请填写检测人员" clearable />
                    </el-form-item>

                </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                    <el-form-item label="备注">
                        <el-input v-model="newIpqc.indexRemark" :rows="2" type="textarea" />
                    </el-form-item>
                </el-col>
            </el-row>

        </el-form>

        <template #footer>
            <span class="dialog-footer">
                <el-button @click="cancelAddIpqc">取消</el-button>
                <el-button type="success" @click="newFinishDialogVisible = true">
                    完成
                </el-button>
                <el-button type="primary" @click="doAddIndexIpqc">
                    保存
                </el-button>
            </span>
        </template>
    </el-dialog>
    <!--新增弹窗结束 -->

    <!-- 新增完成按钮的弹窗 -->
    <el-dialog v-model="newFinishDialogVisible" title="系统提示" width="30%" draggable>
        <span><el-icon>
                <WarnTriangleFilled />
            </el-icon>是确认完成工单编制?【确认后将不能更改】</span>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="newFinishDialogVisible()">取消</el-button>
                <el-button type="primary" @click="newFinish()">
                    确定
                </el-button>
            </span>
        </template>
    </el-dialog>
    <!-- 新增完成表单结束 -->

    <!-- 工单搜索表单开始 -->
    <el-dialog v-model="searchWork" title="工单选择" width="80%" align-center>
        <!-- 搜索栏开始 -->
        <el-form style="margin-top: 15px;" :inline="true" :model="searchWorkOrder" class="demo-form-inline">
            <el-row>
                <el-col :span="6">
                    <el-form-item label="工单编码">
                        <el-input v-model="searchWorkOrder.workOrderCode" placeholder="请输入工单编码" clearable />
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="工单名称">
                        <el-input v-model="searchWorkOrder.workOrderName" placeholder="请输入工单名称" clearable />
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="产品编号">
                        <el-input v-model="searchWorkOrder.productCode" placeholder="请输入产品编号" clearable />
                    </el-form-item>
                </el-col>
            </el-row>

            <el-form-item label="产品名称">
                <el-input v-model="searchWorkOrder.productName" placeholder="请输入产品名称" clearable />
            </el-form-item>
            <el-form-item label="客户名称">
                <el-input v-model="searchWorkOrder.clientName" placeholder="请输入客户名称" clearable />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="handleSeach">搜索</el-button>
                <el-button @click="handleReset"><el-icon>
                        <refresh />
                    </el-icon>重置</el-button>
            </el-form-item>
        </el-form>
        <!-- 搜索栏结束 -->
        <!-- 表格 开始 -->
        <el-table ref="workOrderTable" :data="workOrders">
            <el-table-column type="selection" width="55" />
            <el-table-column width="200" label="工单编码" property="workOrderCode" />
            <el-table-column width="200" label="工单名称" property="workOrderName" />
            <el-table-column width="100" label="工单来源" property="orderSource" />
            <el-table-column width="100" label="订单编号" property="sourceCode" />
            <el-table-column width="200" label="产品编号" property="productCode" />
            <el-table-column width="100" label="产品名称" property="productName" />
            <el-table-column width="100" label="单位" property="unitOfMeasure" />
            <el-table-column width="100" label="工单数量" property="quantity" />
            <el-table-column width="100" label="调整数量" property="quantityChanged" />
            <el-table-column width="100" label="已生产的数量" property="quantityScheduled" />
            <el-table-column width="100" label="批次号" property="batchCode" />
            <el-table-column width="100" label="客户编码" property="clientCode" />
            <el-table-column width="100" label="客户名称" property="clientName" />
            <el-table-column width="200" label="需求日期" property="requestDate" />
            <el-table-column width="100" label="单据状态" property="status">
            </el-table-column>

        </el-table>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="cancelUpdateWork">取消</el-button>
                <el-button type="primary" @click="doUpdateWork">提交</el-button>
            </span>
        </template>

    </el-dialog>
    <!-- 工单表格结束 -->

    <!-- 工作站选择开始 -->
    <el-dialog v-model="searchStation" title="供应商选择" width="80%" align-center>
        <el-form :inline="true" :model="search" class="demo-form-inline">
            <el-row>
                <el-col :span="5">
                    <el-form-item label="工作站编码">
                        <el-input v-model="search.workstationCode" placeholder="请输入工作站编码" />
                    </el-form-item>
                </el-col>
                <el-col :span="5">
                    <el-form-item label="工作站名称">
                        <el-input v-model="search.workstationName" placeholder="请输入工作站名称" />
                    </el-form-item>
                </el-col>
                <el-col :span="5">
                    <el-form-item label="所在车间名称">
                        <el-select :model="workshops" v-model="search.workshopName" placeholder="请选择所在车间">
                            <el-option v-for="item in workshops" :key="item.workshopId" :label="item.workshopName"
                                :value="item.workshopName" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="5">
                    <el-form-item label="所属工序">
                        <el-select :model="processes" v-model="search.processName" placeholder="请选择所属工序">
                            <el-option v-for="item in processes" :key="item.processId" :label="item.processName"
                                :value="item.processName" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="4">
                    <el-form-item>
                        <el-button type="primary" @click="loadWorkstations"><el-icon>
                                <search />
                            </el-icon>搜索</el-button>
                        <el-button @click="handleReset"><el-icon>
                                <refresh />
                            </el-icon>重置</el-button>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <!-- 表格 开始 -->
        <el-table ref="table" :data="workstations" max-height="800px" style="margin-top: 10px;">
            <el-table-column type="selection" width="55" />
            <el-table-column label="工作站编码" prop="workstationCode" />
            <el-table-column label="工作站名称" property="workstationName" />
            <el-table-column label="工作站地点" property="workstationAddress" />
            <el-table-column label="所在车间名称" property="workshopName" />
            <el-table-column label="所属工序" property="processName" />
            <el-table-column label="是否启用" property="enableFlag">
                <template #default="scope">
                    <el-tag v-if="scope.row.enableFlag == 1" type="success">启用</el-tag>
                    <el-tag v-else type="danger">禁用</el-tag>
                </template>
            </el-table-column>
            <el-table-column label="备注" property="remark" />
        </el-table>
        <!-- 分页栏开始 -->
        <el-pagination style="margin-top: 15px;" :page-size="limit" :pager-count="maxPageNum" @current-change="changePage"
            background layout="prev, pager, next" :total="total" />
        <!-- 分页栏结束 -->
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="cancelUpdateStation">取消</el-button>
                <el-button type="primary" @click="doUpdateStation">提交</el-button>
            </span>
        </template>
    </el-dialog>
    <!-- 工作站选择结束 -->

    <!--编辑过程检验数据开始 -->
    <el-dialog v-model="updateIpqcDialogVisible" title="编辑检验名单" width="65%" align-center>
        <!-- 添加检测的表单 -->
        <el-form label-width="100px" :model="updateIpqc" style="max-width: 900px">

            <el-row>
                <el-col :span="12">
                    <el-form-item label="检验单编号">
                        <el-input v-model="updateIpqc.ipqcCode" placeholder="请输入检验单编号" />
                    </el-form-item>

                </el-col>
                <el-col :span="12">
                    <el-form-item label="检验单名称">
                        <el-input v-model="updateIpqc.ipqcName" placeholder="请输入检验单名称" />
                    </el-form-item>

                </el-col>
            </el-row> <el-row>
                <el-col :span="8">
                    <el-form-item label="检验类型">
                        <el-select v-model="updateIpqc.ipqcType" placeholder="请选择检测类型">
                            <el-option label="首检" value="首检" />
                            <el-option label="未检" value="未检" />
                            <el-option label="自检" value="自检" />
                            <el-option label="巡检" value="巡检" />
                            <el-option label="点检" value="点检" />
                            <el-option label="终检" value="终检" />
                        </el-select>
                    </el-form-item>

                </el-col>
                <el-col :span="8">
                    <el-form-item label="工单编码">
                        <el-input v-model="updateIpqc.workorderCode" disabled placeholder="请搜索工序编码">
                            <template #append>
                                <el-button @click="this.searchWork = true" type="primary"><el-icon>
                                        <Search />
                                    </el-icon></el-button>
                            </template>
                        </el-input>
                    </el-form-item>

                </el-col>
                <el-col :span="8">
                    <el-form-item label="工单名称">
                        <el-input v-model="updateIpqc.workorderName" disabled />
                    </el-form-item>

                </el-col>
            </el-row>

            <el-row>
                <el-col :span="8">
                    <el-form-item label="工作站编号">
                        <el-input v-model="updateIpqc.workstationCode" disabled placeholder="请搜索工序编码">
                            <template #append>
                                <el-button @click="this.searchStation = true" type="primary"><el-icon>
                                        <Search />
                                    </el-icon></el-button>
                            </template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="工作站名称">
                        <el-input v-model="updateIpqc.workstationName" disabled clearable />
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="检测数量">
                        <el-input v-model="updateIpqc.quantityCheck" />
                    </el-form-item>
                </el-col>
            </el-row>
            <!--  -->
            <div class="demo-collapse">
                <el-collapse accordion>
                    <el-collapse-item name="1">
                        <template #title>
                            更多信息<el-icon class="header-icon">
                                <info-filled />
                            </el-icon>
                        </template>
                        <div>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="产品编码">
                                        <el-input v-model="updateIpqc.itemCode" disabled>
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="产品名称">
                                        <el-input v-model="updateIpqc.itemName" disabled clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="单位">
                                        <el-input v-model="updateIpqc.unitOfMeasure" disabled />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="24">
                                    <el-form-item label="规格型号">
                                        <el-input v-model="updateIpqc.specification" :rows="2" type="textarea" />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="工序编码">
                                        <el-input v-model="updateIpqc.processCode" placeholder="请输入工序编码" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="工序名称">
                                        <el-input v-model="updateIpqc.processName" placeholder="请输入工序名称" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="任务编号">
                                        <el-input v-model="updateIpqc.taskCode" placeholder="请输入任务编号" clearable />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="8">

                                    <el-form-item label="任务名称">
                                        <el-input v-model="updateIpqc.taskName" placeholder="请输入任务名称" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="不合格数">
                                        <el-input v-model="updateIpqc.quantityUnqualified" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="合格数量">
                                        <el-input v-model="updateIpqc.quantityQuanlified" placeholder="请输入合格数量" clearable />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="致命缺陷数量">
                                        <el-input v-model="updateIpqc.crQuantity" placeholder="请输入致命缺陷数量" clearable />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="严重缺陷数量">
                                        <el-input v-model="updateIpqc.majQuantity" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="轻微缺陷数量">
                                        <el-input v-model="updateIpqc.minQuantity" placeholder="请输入轻微缺陷数量" clearable />
                                    </el-form-item>
                                </el-col>
                            </el-row>

                        </div>
                    </el-collapse-item>
                </el-collapse>
            </div>

            <el-row>
                <el-col :span="8">
                    <el-form-item label="检测日期">
                        <el-date-picker v-model="updateIpqc.inspectDate" value-format="YYYY/MM/DD" type="date"
                            placeholder="请选择检测日期" />
                    </el-form-item>

                </el-col>
                <el-col :span="8">
                    <el-form-item label="检测结果">
                        <el-select v-model="updateIpqc.checkResult" placeholder="请选择检测结果">
                            <el-option label="检验通过" value="检验通过" />
                            <el-option label="检验不通过" value="检验不通过" />
                        </el-select>
                    </el-form-item>

                </el-col>
                <el-col :span="8">

                    <el-form-item label="检测人员">
                        <el-input v-model="updateIpqc.inspecor" placeholder="请填写检测人员" clearable />
                    </el-form-item>

                </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                    <el-form-item label="备注">
                        <el-input v-model="updateIpqc.indexRemark" :rows="2" type="textarea" />
                    </el-form-item>
                </el-col>
            </el-row>

        </el-form>

        <template #footer>
            <div v-if="updateIpqc.status == '草稿' || updateIpqc.status != '已完成'">
                <el-button @click="cancelAddIpqcupdate">取消</el-button>
                <el-button type="success" @click="FinishDialogVisibleupdate = true">
                    完成
                </el-button>
                <el-button type="primary" @click="doAddIndexIpqcupdate">
                    保存
                </el-button>
            </div>
            <div v-if="updateIpqc.status == '已完成'">
                    <el-button size="small" type="info" @click="cancelAddIpqcupdate">取消</el-button>
                    <el-button size="small" type="success" @click="cancelAddIpqcupdate">返回</el-button>
                </div>
        </template>
    </el-dialog>
    <!-- 编辑完成按钮的弹窗 -->
    <el-dialog v-model="FinishDialogVisibleupdate" title="系统提示" width="30%" draggable>
        <span><el-icon>
                <WarnTriangleFilled />
            </el-icon>确认完成检验单编制？一旦完成，此工单将无法继续报工</span>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="CanceDialogVisible()">取消</el-button>
                <el-button type="primary" @click="updateFinish()">
                    确定
                </el-button>
            </span>
        </template>
    </el-dialog>
        <!--编辑过程检验数据结束 -->
        </div>
</template>

<script>

import ipqcRequst from '../../../api/ipqc-api.js';
import mdWorkshopRequest from '../../../api/md-workshop';
import mdWorkstationRequest from '../../../api/md-workstation';
import workorderRequest from '../../../api/pro-workorder-api';

import itemTypeRequest from "../../../api/md-item-type";
import mdItemRequest from "../../../api/md-item";
export default {
    data() {
        return {
            queryIpqc: {},//封装搜索数据
            addIpqcDialogVisible: false,//新增按钮窗口
            ipqc: [],//表格数据
            ipqcCurrPage: 1, //  分页的当前页码
            ipqcLimit: 10, // 分页的每页大小
            ipqcTotal: 0, //  列表的总条数
            ipqcMaxPage: 1,//  列表的最大页码
            DialogVisibles: false,//查看信息弹窗
            newIpqc: {},//封装新增表格事件
            lookIpqc: {},//查看表格
            updateIpqc: {},//封装编辑表格事件
            updateIpqcDialogVisible: false,//表格弹窗事件

            // ============工作站=========
            // 分页数据
            page: 1, // 页数
            limit: 10, // 每页条数
            total: 0, // 总条数
            maxPageNum: 1, // 最大页数
            workstations: [], // 查询到的车间数据
            search: {}, // 搜索的对象
            workshops: [], // 车间所有数据
            processes: [], // 工序所有数据
            searchStation: false,//工作站弹窗
            //============工单
            searchWorkOrder: {},
            workOrders: [],
            isShowAll: true,// 默认展示所有数据
            searchWork: false,//工单弹窗
            FinishDialogVisible: false,//完成弹窗
            newFinishDialogVisible: false,//新增完成弹窗
            FinishDialogVisibleupdate: false,//编辑完成弹窗

        }

    },
    methods: {
        //对选删除按钮
        handlerDeleteIqc() {
            // 获取表格对象
            let table = this.$refs.ipqcTable;
            // 通过API获取被选中的数据 
            let selectionRows = table.getSelectionRows();
            if (selectionRows == undefined || selectionRows.length == 0) {
                this.$message({
                    type: "info",
                    message: "您没有选中任何行"
                });
            }
            // console.log(selectionRows);
            // 可以进行批量改删除了
            //批量删除的第一件事
            //生产一个要删除的userId的数组
            let ipqcIds = [];

            //forEach 指的是从数组每一次取值是会赋值给user
            selectionRows.forEach(ipqc => {
                // console.log(defect);
                ipqcIds.push(ipqc.ipqcId);
            });
            console.log(ipqcIds);
            //调用API进行删除
            ipqcRequst.deletes(ipqcIds, res => {
                this.$message({
                    type: "success",
                    message: "成功删除" + res.msg + "条数据"
                });
                this.loadipqc();//重新加载数据
            });

        },


        //多编辑事件
        handlerEditIqc() {
            // 获取表格对象
            let table = this.$refs.ipqcTable;
            // 通过API获取被选中的数据 
            let selectionRows = table.getSelectionRows();
            if (selectionRows == undefined || selectionRows.length == 0) {
                this.$message({
                    type: "info",
                    message: "您没有选中任何行"
                });
            }

            // 获取第一行数据
            let row = selectionRows[0];
            // 调用行编辑事件
            this.handleEdit(row);

        },
        //行删除事件
        handleDelete(row) {
            ipqcRequst.delete(row.ipqcId, res => {
                if (res.code == 200) {
                    this.$message({
                        type: "success",
                        message: "删除成功"
                    });
                    this.loadipqc();//重新加载数据
                } else {
                    this.$message({
                        type: "error",
                        message: "删除失败"
                    });
                }
            })

        },

        //编辑按钮事件
        handleEdit(row) {
            // 通过id加载要编辑的用户信息
            ipqcRequst.get(row.ipqcId, res => {
                // 将查询的用户信息设置到editUser中
                this.updateIpqc = res.data;
                // 显示抽屉弹窗
                this.updateIpqcDialogVisible = true;

            });

        },
        //编辑按钮事件中取消按钮
        cancelAddIpqcupdate() {
            //关闭窗体
            this.updateIpqcDialogVisible = false;
            //将数据制空
            this.updateIpqc = {};

        },
        //编辑按钮中的确定按钮
        doAddIndexIpqcupdate() {
            ipqcRequst.edit(this.updateIpqc, res => {
                // 这里的res就是我们的后端返回的perResult对象
                if (res.code == '200') {
                    this.$message({
                        message: '编辑成功',
                        type: 'success'
                    });
                    //关闭窗体
                    this.updateIpqcDialogVisible = false;
                    // 重新加载数据
                    this.loadipqc();
                    // 将editIndex制空
                    this.updateIpqc = {};
                } else {
                    this.$message({
                        message: '编辑失败',
                        type: 'error',
                    });
                }
            });

        },
        //编辑完成取消按钮
        CanceDialogVisible() {
            this.FinishDialogVisibleupdate = false;

        },
        //编辑确定完成按钮
        updateFinish() {
            this.updateIpqc.status = "已完成";
            ipqcRequst.edit(this.updateIpqc, res => {
                // 这里的res就是我们的后端返回的perResult对象
                if (res.code == '200') {
                    this.$message({
                        message: '已完成',
                        type: 'success'
                    });
                    //关闭窗体
                    this.FinishDialogVisibleupdate = false;
                    this.updateIpqcDialogVisible = false;
                    // 重新加载数据
                    this.loadipqc();
                    // 将newDefect制空
                    this.updateIpqc = {};

                } else {
                    this.$message({
                        message: '添加失败',
                        type: 'error',
                    });
                }
            });

        },

        //完成取消按钮
        newFinishDialogVisible() {
            this.newFinishDialogVisible = false;

        },
        //新增完成确定按钮
        newFinish() {
            this.newIpqc.status = "已完成";
            ipqcRequst.save(this.newIpqc, res => {
                // 这里的res就是我们的后端返回的perResult对象
                if (res.code == '200') {
                    this.$message({
                        message: '已完成',
                        type: 'success'
                    });
                    //关闭窗体
                    this.newFinishDialogVisible = false;
                    this.addIpqcDialogVisible = false;
                    // 重新加载数据
                    this.loadipqc();
                    // 将newDefect制空
                    this.newIpqc = {};

                } else {
                    this.$message({
                        message: '添加失败',
                        type: 'error',
                    });
                }
            });

        },
        //完成按钮窗口的确定
        Finish() {
            this.newIpqc.status = "已完成";
            console.log(this.newIpqc);
            ipqcRequst.edit(this.newIpqc, res => {
                // 这里的res就是我们的后端返回的perResult对象
                if (res.code == '200') {
                    this.$message({
                        message: '检验完成',
                        type: 'success'
                    });
                    //关闭窗体
                    this.addIpqcDialogVisible = false;
                    this.FinishDialogVisible = false;
                    // 重新加载数据
                    this.loadipqc();
                } else if (res.code == '300') {
                    this.$message({
                        message: '用户名重复',
                        type: 'warning',
                    });
                } else {
                    this.$message({
                        message: '编辑失败',
                        type: 'error',
                    });
                }
            });
        },
        //查看信息取消按钮事件
        cancelLookIpqcEdit() {
            this.DialogVisibles = false;
            this.lookIpqc = {};
        },
        //查看按钮返回事件
        doLookIpqcReturn() {
            this.DialogVisibles = false;
            this.lookIpqc = {};
        },
        //新增取消按钮
        cancelAddIpqc() {
            // 将newDefect制空
            this.newIpqc = {};
            // 关闭窗体
            this.addIpqcDialogVisible = false;
        },
        //新增提交按钮
        doAddIndexIpqc() {
            this.newIpqc.status = "草稿";
            console.log(this.newIpqc);
            ipqcRequst.save(this.newIpqc, res => {
                // 这里的res就是我们的后端返回的perResult对象
                if (res.code == '200') {
                    this.$message({
                        message: '添加成功',
                        type: 'success'
                    });
                    //关闭窗体
                    this.addIpqcDialogVisible = false;
                    // 重新加载数据
                    this.loadipqc();
                    // 将newDefect制空
                    this.newIpqc = {};

                } else {
                    this.$message({
                        message: '添加失败',
                        type: 'error',
                    });
                }
            });

        },
        // ============工单
        //搜索工作站弹窗取消按钮
        cancelUpdateWork() {
            this.searchWork = false;//关闭窗体
            this.loadWorkOrder(true);

        },
        //搜索工作站提交按钮  
        doUpdateWork() {
            let table = this.$refs.workOrderTable; // 获取表格对象
            let rows = table.getSelectionRows(); // 通过API获取被选中的数据
            this.newIpqc.workorderCode = rows[0].workOrderCode;
            this.newIpqc.workorderName = rows[0].workOrderName;
            this.newIpqc.itemCode = rows[0].productCode;
            this.newIpqc.itemName = rows[0].productName;
            this.newIpqc.unitOfMeasure = rows[0].unitOfMeasure;

            //编辑
            this.updateIpqc.workorderCode = rows[0].workOrderCode;
            this.updateIpqc.workorderName = rows[0].workOrderName;
            this.updateIpqc.itemCode = rows[0].productCode;
            this.updateIpqc.itemName = rows[0].productName;
            this.updateIpqc.unitOfMeasure = rows[0].unitOfMeasure;
            this.searchWork = false;
            //重新加载数据
            this.loadWorkOrder(true);

        },
        //加载树菜单页面数据
        loadItemType(isReal) {
            if (this.itemTypes == undefined || this.itemTypes.length == 0 || isReal) {
                itemTypeRequest.listTree(res => {
                    this.itemTypes = res.data;
                })
            }
        },
        // 加载表格数据
        loadItem() {
            mdItemRequest.list(this.page, this.limit, this.search, res => {
                this.items = res.data.list;
                this.total = res.data.total;
                this.maxPageNum = res.data.pages;
            })
        },
        //条件搜索重置按钮事件
        handleReset() {
            this.searchWorkOrder = {};
            this.loadWorkOrder(true);
        },
        // 加载页面数据
        loadWorkOrder(isReal) {
            if (this.workOrders == undefined || this.workOrders.length == 0 || isReal) {
                workorderRequest.listTree(res => {
                    this.workOrders = res.data;
                })
            }
        },

        // ============工作站

        //搜索工作站弹窗取消按钮
        cancelUpdateStation() {
            this.searchStation = false;//关闭窗体

            this.loadWorkstations();

        },
        //搜索工作站提交按钮  
        doUpdateStation() {
            let table = this.$refs.table; // 获取表格对象
            let rows = table.getSelectionRows(); // 通过API获取被选中的数据
            this.newIpqc.workstationCode = rows[0].workstationCode;
            this.newIpqc.workstationName = rows[0].workstationName;

            //编辑
            this.updateIpqc.workstationCode = rows[0].workstationCode;
            this.updateIpqc.workstationName = rows[0].workstationName;

            this.searchStation = false;
            //重新加载数据
            this.loadWorkstations();

        },
        //加载所有工序
        loadProcesses() {
            mdWorkstationRequest.listProcess(res => {
                this.processes = res.data;
            })
        },
        //加载所有车间数据
        loadWorkshops() {
            mdWorkshopRequest.list(1, 100, null, res => {
                this.workshops = res.data.list;
            })
        },
        //搜索栏重置按钮事件
        handleReset() {
            this.search = {}; // 搜索对象置空
            this.loadWorkstations(); // 重新加载数据
        },
        //点击分页事件
        changePage(val) {
            this.page = val;
            this.loadWorkstations();
        },
        //加载表格数据
        loadWorkstations() {
            mdWorkstationRequest.list(this.page, this.limit, this.search, res => {
                this.workstations = res.data.list;
                this.total = res.data.total;
                this.maxPageNum = res.data.pages;
            })
        },
        // ===============工作站结束

        //点击编号查看信息按钮
        showIpqcData(iqcId) {
            ipqcRequst.get(iqcId, res => {
                // 将查询的用户信息设置到editUser中
                this.lookIpqc = res.data;
                this.loadipqc();
                this.DialogVisibles = true;
            });
        },
        //分页
        changePageIpqc(value) {
            this.ipqcCurrPage = value;
            this.loadipqc();

        },
        //重置
        resettingipqc() {
            // 将newUser制空
            this.queryIpqc = {};
            this.loadipqc();
        },
        //加载数据
        loadipqc() {
            ipqcRequst.list(this.ipqcCurrPage, this.ipqcLimit,
                this.queryIpqc, res => {
                    // 设置数据
                    this.ipqc = res.data.list;
                    this.ipqcTotal = res.data.total;
                    this.ipqcMaxPage = res.data.pages;
                });
        },
    },
    mounted() {
        this.loadipqc();
        this.loadWorkstations();
        this.loadWorkshops();
        this.loadProcesses();
        this.loadWorkOrder();
        this.loadItemType();
        this.loadItem();





    }
}


</script>